<template>
    <div>
        <Tables 
			:title='title' 
			:field='field' 
			:butns="butns" 
			:tableData='tableData' 
			:perNum='per_num'
			:pageSize="pageSize"
			:animateShow="animate_show"
			:totalNum="total_num" 
			@reset="reset"
			:rankable="true"
            @rankData="handleRankData"
			@changePageSize='handleChangePageSize'
			@loadData="loadData" 
			@sentEditData="getEditData" 
			@clearEvent="clearModal"
			@setBolck="setBolckModal" 
			:tableNotice="'备注可快速修改,外部主机(IP)不能添加主机备注。'">

			<div slot="filter">
				<search :searchFiled="searchFiled" @searchEvent="loadData"></search>
			</div>
		</Tables>
		<!--清除所有日志-->
		<Modals 
			:id="'clear'" 
			:title="'提示'" 
			:status="status" 
			:errorMsg="errorMsg" 
			@sentErrorMsg="getErrorMsg" 
			@modalEvent="clearAll">

		  	<div slot="modal_content">
				<p style="font-size:16px;">确定清除所有{{title}}？</p>
			</div>
		</Modals>
		<!--封堵-->
        <Modals 
			:id="'blockModal'" 
			:title="this.block?'解封主机':'封堵主机'"
			:status="status" 
			:errorMsg="errorMsg"  
			@sentErrorMsg="getErrorMsg"  
			@modalEvent="setBolck">

			<div slot="add_edit">
				<p style="font-size: 16px;">确定{{this.block?'解封':'封堵'}}该主机？</p>
			</div>
		</Modals>
		<!--详情-->
		<detailModal :detail="edit_data"></detailModal>
    </div>
</template>
<script>
    import Tables from 'components/common/Tables'
    import Modals from 'components/common/Modals'
	import search from 'components/common/search'
	import detailModal from 'components/common/detailModal'
    import LogManageService from 'services/logManageService'
	import IndexService from 'services/indexService'
	let butns = [
        {
            type:'other',
            name:'清空',
            event:'clearEvent',
            icon:'/static/img/w_clear.png'
        }
    ]
    let field = [
        {
            type:'rank'
		},
		
		{
            type:'none',
            label:'物理线路',
            name:'groupid',
		},
		
		{
            type:'none',
            label:'攻击源',
            name:'mac',
		},
		
		{
            type:'none',
            label:'备注',
            name:'description',
			editable:true,
			regex:/^[\w\u4e00-\u9fa5]{0,16}$/
		},
		
		{
            type:'none',
            label:'攻击类型',
            name:'attack_type',
		},
		
		{
            type:'none',
            label:'次数',
            name:'count',
		},
		
		{
            type:'none',
            label:'时间',
            name:'end_time',
		},
		
		{
            type:'none',
            label:'封堵状态',
            name:'is_block',
		},
		
		{
			type:'opration',
			label:['解封','封堵'],
            event:'setBolck',
			linkname:'block',
			collectname:'mac'
		}
    ]
	let searchFiled = [
		{
            type:'text',
            label:'IP|MAC',
            name:'attack_source',
           regex: /^((2[0-4]\d|25[0-5]|[01]?\d\d?)\.){0,3}(2[0-4]\d|25[0-5]|[01]?\d\d?)?$|^([0-9A-Fa-f]{2}:){1,6}$/,
        },
        {
            type:'time-rang',
            label:'时间范围',
            name:['start_time','end_time'],
        }

	]
    export default {
		components: {
		    Tables,
            Modals,
			search,
			detailModal

	    },
        data() {
            return {
                title: '渗透日志',
                field: field,
				butns: butns,
                tableData: [],
                per_num: 10,
                total_num: 1,
                status: "",
                errorMsg: '',
                type: '',
				searchFiled: searchFiled,
				block: '',
				cur_page: 1,
				orderby: '',
				order: 'desc',
				edit_data: {},
				finddata: {},
				animate_show: false,
				pageSize: [10, 20, 40, 80],
				start_time: '',
				end_time: '',
				q_attack_source: ''
            }
        },
        created() {
            let params = {
                 oper: 'load',
                 page: 1,
            }
            this.loadData(params)
        },
        methods: {
			handleRankData(params, tableName) {
				this.orderby = params.by
				this.order = params.order
				this.loadData({
					page: this.cur_page,
					size: this.per_num,
					orderby: params.by === 'mac' ? 'attack_source' : params.by,
					order: params.order
				})
			},
			handleChangePageSize(page, size, tableName) {
				this.cur_page = page
				this.per_num = size
				this.loadData({
					page: page,
					size: size,
					orderby: this.orderby,
					order: this.order
				})
			},
			clearModal() {
				$("#clear").modal('show')
			},
			clearAll() {
				this.status = 'ing'
				LogManageService.clearPermeateLog()
				.then((res) => {
					if (res.errcode === 0) {
						this.status = 'ok'
						let params = {
							oper: 'load',
							page: 1,
						}
						this.loadData(params)
					} else {
						this.status = 'error'
						this.errorMsg = res.errorMessage
					}
				})
			},
			reset(type) {
                this.status = ""
                this.errorMsg = ''
                this.type = type
				if (type === 'edit') {
					$("#detailModel").modal('show')
				}              
            },
            getSelectedItems(selectedItems) {
                this.selectedItems = selectedItems
            },
            getEditData(editdata) {
                this.edit_data = editdata 
            },
            getErrorMsg(msg) {
                this.errorMsg = msg
            },
			setBolckModal(block, operid) {
				this.reset()
				this.block = block
				this.edit_data = {
					ipmac: operid,
					oper: block ? 'unblock' : 'block'
				}	
				$('#blockModal').modal('show')
			},
            setBolck() {
				this.status = 'ing'	
				IndexService.setBlock(this.edit_data)
				.then((res) => {
					if (res.errcode === 0) {
						this.status = 'ok'
						let params = {
							oper: 'load',
                			page: this.cur_page,
						}
						this.loadData(params)
					} else {
						this.status = 'error'
						this.errorMsg = res.errorMessage
					}
				})
			},
            loadData(params) {
				if (params.oper === 'find') {
					this.start_time = params.start_time
					this.end_time = params.end_time
					this.q_attack_source = params.attack_source
					params.size = 10
					this.finddata = params
					this.animate_show = true
				}
				if (params.oper === 'page_change') {
					params = Object.assign(this.finddata, params) 
				}
				this.cur_page = params.page

				// 追加查询参数，如果查询情况下，也可以进行排序，根据查询的条件
				params.start_time = this.start_time
				params.end_time = this.end_time
				params.attack_source = this.q_attack_source

                LogManageService.getPermeateLog(params)
					.then((res) => {
						this.animate_show = false
						if (res.errcode === 0) {
							this.animate_show = false
							let data = res['1'].logs
							this.total_num = res['1'].count	
							this.tableData = data.map((item) => {
								item.block = item.is_block
								item.is_block = item.is_block ? '已封堵' : '未封堵'
								item.groupid = item.groupid === 0 ? '外部主机' : item.groupid === -1 ? '透传主机' : '线路' + item.groupid
								item.mac = item.attack_source
								switch (Number(item.attack_type)) {
									case 1:
										item.attack_type = '哨兵节点存活探测'
										break
									case 2:
										item.attack_type = '哨兵节点服务探测'
										break
									case 5:
										item.attack_type = '全息节点存活探测'
										break
									case 6:
										item.attack_type = '全息节点服务探测'
										break
									case 7:
										item.attack_type = '端口虚开'
										break
									default:
										break
								}
								return item
							})
						}
					})
            },
        }
    }
</script>